
<style>
  #personalNav {
    text-align: center;
    background-color: #000000;
    width: 6em;
  }
  a {
    text-align: center;
    color: #ffffff;
    display: block;
  }
  a:active {
    color: #808080;
  }
  div[ui-view=content] > * {
    background-color: #dcdcdc;
  }

</style>


<div class="col-sm-1" style="margin-top: 3.67em;padding: 0">
  <ul id="personalNav" class="nav nav-pills nav-stacked">
    <li role="presentation">
      <a ui-sref="userRoot.home">
        <span class="glyphicon glyphicon-home"></span>
        <span>Space</span>
      </a>
    </li>
    <li role="presentation">
      <a ui-sref="user.lesson">
        <span class="glyphicon glyphicon-th"></span>
        <span>Lesson</span>
      </a>
    </li>
    <li role="presentation" class="active">
      <a ui-sref="user.setting.profile">
        <span class="glyphicon glyphicon-cog"></span>
        <span>Setting</span>
      </a>
    </li>
  </ul>
</div>

<div class="col-sm-11">
  <div ui-view="content"></div>
</div>




